$(function () {
  var layer = layui.layer
  var form = layui.form

  //调用
  initArtCateList()
  //获取文章分类的列表 
  function initArtCateList() {
    $.ajax({
      type: 'get',
      url: '/my/article/cates',
      success: function (res) {
        //渲染到页面上
        var htmlStr = template('tpl-table', res)
        $('tbody').html(htmlStr)

      }
    })

  }
  //为添加类别绑定点击事件 弹出 弹出层
  $('#btnAddCate').on('click', function () {
    //open 方法返回弹出层的编号
    indexAdd = layer.open({
      type: 1,
      area: ['500px', '250px'],
      title: '添加文章分类',
      content: $('#dialog-add').html()
    })

  })

  // 为 form-add 表单绑定 submit 事件 委托事件
  $('body').on('submit', '#form-add', function (e) {
    e.preventDefault()
    $.ajax({
      type: 'post',
      url: '/my/article/addcates',
      data: $(this).serialize(),
      success: function (res) {
        if (res.status !== 0) {
          return layer.msg('新增文章分类失败！')
        }
        initArtCateList()
        layer.msg('新增文章分类成功！')
        // 根据索引，关闭对应的弹出层
        layer.close(indexAdd)

      }

    })
  })


  // 委托事件 为btn-edit 编辑按钮绑定点击事件
  var indexEdit = null
  $('tbody').on('click', '.btn-edit', function () {

    //弹出修改文章的层
    indexEdit = layer.open({
      type: 1,
      area: ['500px', '250px'], 
      title: '修改文章分类',
      content: $('#dialog-edit').html()
    })

    var id = $(this).attr('data-id')
    //发请求
    $.ajax({
      type: 'get',
      url: '/my/article/cates/' + id,
      success: function (res) {
        form.val('form-edit', res.data)
      }

    })
  })


  // //第一种通过代理  为修改表单绑定submit 事件

  $('body').on('submit', '#form-edit', function (e) {
    e.preventDefault()
    $.ajax({
      type: 'post',
      url: '/my/article/updatecate',
      data: $(this).serialize(),
      success: function (res) {
        if (res.status !== 0) {
          return layer.msg('更新分类信息失败！')
        }
        initArtCateList()
        layer.msg('更新分类信息成功！')
        // 根据索引，关闭对应的弹出层
        layer.close(indexEdit)

      }

    })
  })


  //第二种通过代理  为修改表单绑定submit 事件

  // $('body').on('submit', '#form-edit', function (e) {
  //   e.preventDefault()
  //   var name = $("#username").val()
  //   var alias = $("#aname").val()

  //   $.ajax({
  //     type: 'post',
  //     url: '/my/article/updatecate',
  //     data: {
  //       name: name,
  //       alias: alias,
  //       Id: localStorage.getItem('id')


  //     },
  //     success: function (res) {
  //       if (res.status !== 0) {
  //         return layer.msg('更新分类信息失败！')
  //       }
  //       initArtCateList()
  //       layer.msg('更新分类信息成功！')
  //       // 根据索引，关闭对应的弹出层
  //       layer.close(indexEdit)

  //     }

  //   })
  // })


  // 通过代理的形式，为删除按钮绑定点击事件
  $('tbody').on('click', '.btn-delete', function () {
    var id = $(this).attr('data-id')
    // 提示用户是否要删除
    layer.confirm('确认删除?', { icon: 3, title: '提示' }, function (index) {
      $.ajax({
        method: 'GET',
        url: '/my/article/deletecate/' + id,
        success: function (res) {
          if (res.status !== 0) {
            return layer.msg('删除分类失败！')
          }
          layer.msg('删除分类成功！')
          layer.close(index)
          initArtCateList()
        }
      })
    })
  })

})














// $(function () {
//   var layer = layui.layer
//   var form = layui.form

//   initArtCateList()

//   // 获取文章分类的列表
//   function initArtCateList() {
//     $.ajax({
//       method: 'GET',
//       url: '/my/article/cates',
//       success: function (res) {
//         var htmlStr = template('tpl-table', res)
//         $('tbody').html(htmlStr)
//       }
//     })
//   }

//   // 为添加类别按钮绑定点击事件
//   var indexAdd = null
//   $('#btnAddCate').on('click', function () {
//     indexAdd = layer.open({
//       type: 1,
//       area: ['500px', '250px'],
//       title: '添加文章分类',
//       content: $('#dialog-add').html()
//     })
//   })

//   // 通过代理的形式，为 form-add 表单绑定 submit 事件
//   $('body').on('submit', '#form-add', function (e) {
//     e.preventDefault()
//     $.ajax({
//       method: 'POST',
//       url: '/my/article/addcates',
//       data: $(this).serialize(),
//       success: function (res) {
//         if (res.status !== 0) {
//           return layer.msg('新增分类失败！')
//         }
//         initArtCateList()
//         layer.msg('新增分类成功！')
//         // 根据索引，关闭对应的弹出层
//         layer.close(indexAdd)
//       }
//     })
//   })

//   // 通过代理的形式，为 btn-edit 按钮绑定点击事件
//   var indexEdit = null
//   $('tbody').on('click', '.btn-edit', function () {
//     // 弹出一个修改文章分类信息的层
//     indexEdit = layer.open({
//       type: 1,
//       area: ['500px', '250px'],
//       title: '修改文章分类',
//       content: $('#dialog-edit').html()
//     })

//     var id = $(this).attr('data-id')
//     // 发起请求获取对应分类的数据
//     $.ajax({
//       method: 'GET',
//       url: '/my/article/cates/' + id,
//       success: function (res) {
//         form.val('form-edit', res.data)
//       }
//     })
//   })

//   // 通过代理的形式，为修改分类的表单绑定 submit 事件
//   $('body').on('submit', '#form-edit', function (e) {
//     e.preventDefault()
//     $.ajax({
//       method: 'POST',
//       url: '/my/article/updatecate',
//       data: $(this).serialize(),
//       success: function (res) {
//         if (res.status !== 0) {
//           return layer.msg('更新分类数据失败！')
//         }
//         layer.msg('更新分类数据成功！')
//         layer.close(indexEdit)
//         initArtCateList()
//       }
//     })
//   })

//   // // 通过代理的形式，为删除按钮绑定点击事件
//   // $('tbody').on('click', '.btn-delete', function () {
//   //   var id = $(this).attr('data-id')
//   //   // 提示用户是否要删除
//   //   layer.confirm('确认删除?', { icon: 3, title: '提示' }, function (index) {
//   //     $.ajax({
//   //       method: 'GET',
//   //       url: '/my/article/deletecate/' + id,
//   //       success: function (res) {
//   //         if (res.status !== 0) {
//   //           return layer.msg('删除分类失败！')
//   //         }
//   //         layer.msg('删除分类成功！')
//   //         layer.close(index)
//   //         initArtCateList()
//   //       }
//   //     })
//   //   })
//   // })
// })
